<template>
    <div>
        <!--头部-->
        <mt-header fixed title="黑马程序员"></mt-header>
        <!--路由占位-->
        <router-view></router-view>
        <!--底部tab-bar-->
        <nav class="mui-bar mui-bar-tab">
            <router-link class="mui-tab-item" to="/home">
                <span class="mui-icon mui-icon-home"></span>
                <span class="mui-tab-label">首页</span>
            </router-link>
            <router-link class="mui-tab-item" to="/tabbar-with-chat">
                <span class="mui-icon mui-icon-email">

                </span>
                <span class="mui-tab-label">会员</span>
            </router-link>
            <router-link class="mui-tab-item" to="/shopcar">
                <span class="mui-icon mui-icon-contact">
                    <span class="mui-badge">0</span>
                </span>
                <span class="mui-tab-label">购物车</span>
            </router-link>
            <router-link class="mui-tab-item" to="/tabbar-with-map">
                <span class="mui-icon mui-icon-gear"></span>
                <span class="mui-tab-label">搜索</span>
            </router-link>
        </nav>
    </div>
</template>

<script>
    import { Toast } from 'mint-ui';
    export default {
        data (){
            return {
                msg: 'hello vuejs'
            }
        },
        methods: {
            tip(){
                Toast('温馨提示：明天傍晚6点10分，您有一个约会！');
            }
        },
        created (){

        }
    }
</script>

<style scoped>
    .red {
        color: red;
    }
</style>